
<!doctype html>
<html>
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
	<script type="text/javascript" src="../jquery-2.1.1.js"></script>
	<title></title>
</head>
<body>

<div id="clickme">
  Click here
</div>
<img id="book"  alt="" width="100" height="123"
  style="background:red;opacity:1;position: relative; left: 500px;" />

<script type="text/javascript">
	

var createTime = function(){
	return  (+new Date)
}
//元素初始化位置
var startLeft = 500;
//元素终点位置
var endLeft = 50;
//动画运行时间
var duration = 2000; 
//动画开始时间
var startTime = createTime();

function tick(){	
	//每次变化的时间
	var remaining = Math.max(0, startTime + duration - createTime())
	var temp = remaining / duration || 0;
	var percent = 1 - temp;
	//最终每次移动的left距离
	var leftPos  = (endLeft- startLeft) * percent +startLeft;
}

//开始执行动画
setInterval(tick, 13);


</script>
</body>
</html>